<template>
	<view>

		<view class="submitOrder_box">
			<view class="consigneeInfor_box">
				<!-- 没有地址 -->
				<view class="addressAdd_con" v-if="addressInfor.id==0" @click="addressAdd">
					<view class="addressAdd">新增收货地址</view>
				</view>
				<!-- 有地址  -->
				<view class="consigneeInfor_con" v-else @click="selectAddress">
					<view class="consigneeIcon">
						<u-icon name="map" color="#327FE8" size="80"></u-icon>
					</view>
					<view class="consigneeCon">
						<view class="consigneeInfor">
							<view class="consigneeName">{{addressInfor.name}}</view>
							<view class="consigneeTel">{{addressInfor.mobile}}</view>
						</view>
						<view class="consigneeAddress">
							{{addressInfor.address}}
						</view>
					</view>
					<view class="consigneeMore">
						<u-icon name="arrow-right" color="#999" size="36"></u-icon>
					</view>
				</view>
			</view>
			<view class="addressLine"></view>

			<!-- 商品信息 -->
			<view class="goodsList_box">
				<view class="goodsList_wrap" v-for="(item, index) in goodsList" :key="index">
				
					<view class="goodsList_con">
						<view class="goodsCon">
							<view class="goodsPic">
								<image :src="item.img_list[0].url" mode="aspectFill"></image>
							</view>
							<view class="goodsInfor">
								<view class="goodsName">{{item.name}}</view>
								
								<view class="goodsPost">
									<view class="goodsPrice">{{item.sale_price}}积分</view>
									<view class="goodsNum">X 1</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>

			<!-- 配送方式 -->
			<view class="orderLogistics_con">
				<view class="formItem formFlex">
					<view class="label">配送方式</view>
					<view class="controls">商家配送</view>
				</view>
			</view>

			<!-- 备注信息 -->
		<!-- 	<view class="orderLogistics_con" @click="goNote">
				<view class="formItem formFlex">
					<view class="label">买家留言</view>
					<view class="controls">{{orderNote}}</view>
				</view>
			</view> -->

			<!-- 积分抵扣 -->
			<view class="orderIntegral_con" v-if="discountList.length>0">
				<view class="integralHead_con">
					<view class="integralTit">
						<image src="/static/images/mall/integral.png" mode=""></image>
						<text>用积分抵扣</text>
					</view>
					<u-switch v-model="checked" active-color="#327FE8" @change="integralChange"></u-switch>
				</view>
				<view class="integralList_con" v-if="checked==true">
					<view class="integralItem" :class="item.selected ? 'active':''" v-for="(item,index) in discountList"
						:key="index" @click="discountClick(index)">
						<view class="integralNum">
							<image src="/static/images/mall/money.png" mode=""></image>
							<text>{{item.jifen_num}}积分</text>
						</view>
						<view class="integralMoney">
							{{item.jifen_num}}积分可抵<text>{{item.price_true}}</text>元
						</view>
					</view>
				</view>
			</view>

			
			<!-- 总价格 -->
			<view class="orderPrice_con">
				共1件商品 共计：
				<text>{{totalPrice}}积分</text>
			</view>
		</view>

		<!-- 提交订单 -->
		<view style="height: 160rpx;"></view>
		<view class="submitPost_con">
			<view class="orderPrice">
				共计：{{totalPrice}}积分
			</view>
			<view class="orderBuy" @click="$u.throttle(submitOrder, 3000)">提交订单</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 收货地址信息
				addressInfor: {
					id:0
				},

				// 购买方式
				buy_type: '',

				// 购物车ids
				cartIds: '',

				// 订单的商品列表信息
				goodsList: [],
				totalPrice: 0, //总价格
				actualPrice: 0, //实付

				// 备注
				orderNote: '',

				// 是否积分抵扣
				checked: false,
				jifen_num: 0,
				price_true: 0,

				// 支付方式
				paymentList: [
					// 	{
					// 	name: '钱包支付',
					// 	value: '1',
					// }, 
					{
						name: '微信支付',
						value: '2',
					}
				],
				paymentValue: '2',

				// 积分抵扣余额配置列表
				discountList: [],
			}
		},
		onLoad(option) {
			console.log(option);
			uni.showLoading({
				title: '加载中'
			});
			var _this = this;
			var buy_type = option.buy_type;
			if (buy_type == 'goods') {
				_this.goods_id = option.goods_id;
				_this.getGoodsDetail();
			} else if (buy_type == 'cart') {
				_this.cartIds = option.id;
				_this.getCartGoods();
			}
			_this.buy_type = option.buy_type;
		},
		onShow() {
			var _this = this;
			_this.getDefaultAddress();
			if(_this.buy_type == 'cart') {
				_this.getCartGoods();
			}
		},
		onReady() {
			var _this = this;
			
		},
		methods: {
			
			// 获取商品详情
			getGoodsDetail() {
				var _this = this;
				_this.$u.get('/api/shop.goods/getDetail', {
					id: _this.goods_id,
				}).then(res => {
					uni.hideLoading();
					
					var resData = res.data;
					_this.goodsList[0] = resData;
					_this.totalPrice=resData.sale_price;
				}).catch(res => {
					console.log(res);
				})
			},
			
			// 获取默认收货地址
			getDefaultAddress() {
				var _this = this;
				_this.$u.post('/api/user.address/getDefault', {}).then(res => {
					uni.hideLoading();
					console.log("==获取默认收货地址==");
					
					_this.addressInfor = res.data;
					
					
				}).catch(res => {
					console.log(res);
				})
			},
			
			
			// 获取默认收货地址
			getCartGoods() {
				var _this = this;
				_this.$u.post('/api/supplier.cart/getList', {
					id:_this.cartIds
				}).then(res => {
					uni.hideLoading();
					_this.goodsList = res.data;
					_this.getTotalPrice();
				}).catch(res => {
					console.log(res);
				})
			},
			
			// 计算总价
			getTotalPrice() {
				var _this = this;
				var goodsList = _this.goodsList;
				var totalPrice = 0;
				for (let i = 0; i < goodsList.length; i++) {
					totalPrice += goodsList[i].num * parseFloat(goodsList[i].goodsInfo.price);
				}
				_this.totalPrice = totalPrice.toFixed(2);
				_this.$forceUpdate();
			},

			// 新增收货地址
			addressAdd() {
				uni.navigateTo({
					url: '/pagesOther/address/addressAdd'
				})
			},

			// 选择地址
			selectAddress() {
				uni.navigateTo({
					url: '/pagesOther/address/addressList?type=confirm'
				})
			},


			

			// 提交订单
			submitOrder() {
				var _this = this;
				if (_this.addressInfor.id==0) {
					uni.showToast({
						title: '收货地址不能为空',
						icon: 'none'
					})
					return;
				}
			
				// 购买方式
				var buy_type = _this.buy_type;
				if (buy_type == 'goods') {
					var postPara = {
						buy_type: 'goods',
						goods_id: _this.goods_id,
						consignee: _this.addressInfor.name,
						mobile: _this.addressInfor.mobile,
						address:_this.addressInfor.address,
						total_price:_this.totalPrice,
						prom_type:'30',
						integral:_this.totalPrice,
					}
				}
				_this.$u.post('/api/shop.order/add_do', postPara, {
					'content-Type': 'application/json',
				}).then(res => {
					uni.hideLoading();
					// 判断金额为0的时候，不用支付直接去订单列表
					uni.navigateTo({
						url: '/pagesOther/order/orderList'
					})
				}).catch(res => {
					console.log(res);
				})
			},

			// 微信支付
			wxPay(order_pay_id, order_id_string) {
				var _this = this;
				_this.$u.post('/api/Weixinpay/weixin_pay', {
					pay_type: 'payordergoods',
					order_pay_id: order_pay_id,
					order_id_string: order_id_string,
				}).then(res => {
					uni.hideLoading();
					console.log("==微信支付==");
					console.log(res);

					var resRequest = res.data;
					uni.requestPayment({
						timeStamp: resRequest.timeStamp.toString(),
						nonceStr: resRequest.nonceStr,
						package: resRequest.package,
						signType: resRequest.signType,
						paySign: resRequest.paySign,
						success: function(res) {
							// console.log(res)
							uni.showToast({
								title: res.msg,
								duration: 2000
							});
							setTimeout(function() {
								uni.navigateTo({
									url: '../payRes/payRes'
								})
							}, 2000)
						},
						fail: function(res) {
							// console.log(res)
							uni.showToast({
								title: '您取消了支付',
								icon: 'none'
							})
							setTimeout(function() {
								uni.redirectTo({
									url: '/pages/order/orderList/orderList'
								})
							}, 2000)
						}
					})
				})
			},

		}
	}
</script>

<style>
	page {
		background-color: #fff;
	}
</style>
<style scoped>
	.submitOrder_box {}

	/* 收货地址 */
	.consigneeInfor_box {
		padding: 30rpx 20rpx;
		overflow: hidden;
	}

	.consigneeInfor_con {
		width: 100%;
		overflow: hidden;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.consigneeIcon {}

	.consigneeCon {
		flex: 2;
		padding: 0 20rpx;
	}

	.consigneeInfor {
		font-size: 28rpx;
		font-weight: bold;
		color: #333;
		overflow: hidden;
		display: flex;
		align-items: center;
	}

	.consigneeInfor .consigneeName {}

	.consigneeInfor .consigneeTel {
		margin-left: 20rpx;
	}

	.consigneeAddress {
		font-size: 24rpx;
		color: #7D7E82;
		overflow: hidden;
		margin-top: 10rpx;
	}

	.addressAdd_con {
		width: 100%;
		overflow: hidden;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.addressAdd {
		width: 480rpx;
		height: 88rpx;
		line-height: 88rpx;
		text-align: center;
		color: #fff;
		font-size: 28rpx;
		background: #327FE8;
		border-radius: 40rpx;
		overflow: hidden;
	}

	.addressLine {
		width: 100%;
		height: 10rpx;
		background: url('/static/addressLine.png') no-repeat center center;
		background-size: cover;
		overflow: hidden;
	}

	/* 商品信息 */
	.goodsList_box {
		overflow: hidden;
	}

	.goodsList_wrap {
		background: #ffffff;
		border-radius: 10rpx;
		overflow: hidden;
		border-bottom: 2rpx solid #f2f2f2;
		
	}

	.goodsShop_con {
		padding: 20rpx;
		border-bottom: 1rpx solid #f2f2f2;
		overflow: hidden;
		display: flex;
		align-items: center;
		
	}

	.shopIcon {
		width: 44rpx;
		height: 44rpx;
	}

	.shopTit {
		font-size: 30rpx;
		font-weight: bold;
		color: #333;
		margin-left: 10rpx;
	}

	.goodsList_con {
		padding: 10rpx 20rpx;
		overflow: hidden;
		
	}

	.goodsCon {
		padding: 10rpx 0;
		overflow: hidden;
		display: flex;
		justify-content: space-between;
	}

	.goodsPic {
		width: 150rpx;
		height: 150rpx;
		border-radius: 10rpx;
		overflow: hidden;
	}

	.goodsPic image {
		width: 100%;
		height: 100%;
	}

	.goodsInfor {
		flex: 2;
		height: 156rpx;
		margin-left: 20rpx;
		position: relative;
	}

	.goodsName {
		font-size: 28rpx;
		font-weight: bold;
		color: #333;
	}

	.goodsSpec {
		padding: 10rpx 0;
		color: #999;
		font-size: 24rpx;
		overflow: hidden;
		display: flex;
		align-items: center;
	}

	.goodsPost {
		width: 100%;
		position: absolute;
		left: 0;
		bottom: 0;
		overflow: hidden;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.goodsPrice {
		color: #FF3133;
	}

	.goodsNum {
		font-size: 24rpx;
		color: #999;
	}

	/* 配送方式 */
	.orderLogistics_con {
		
		padding: 0 20rpx;
	}

	/* 积分抵扣 */
	.orderIntegral_con {
		padding: 20rpx;
		overflow: hidden;
	}

	.integralHead_con {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.integralTit {
		display: flex;
		align-items: center;
	}

	.integralTit image {
		width: 48rpx;
		height: 48rpx;
	}

	.integralTit text {
		font-size: 28rpx;
		color: #333333;
		margin-left: 10rpx;
	}

	.integralList_con {
		padding: 40rpx 0 20rpx 0;
		overflow: hidden;
	}

	.integralItem {
		padding: 20rpx 30rpx;
		border: 1rpx solid #F6F6F9;
		background: #F6F6F9;
		border-radius: 10rpx;
		overflow: hidden;
		margin-bottom: 20rpx;
	}

	.integralItem.active {
		border: 2rpx solid #327FE8;
	}

	.integralNum {
		display: flex;
		align-items: center;
	}

	.integralNum image {
		width: 32rpx;
		height: 32rpx;
	}

	.integralNum text {
		font-size: 28rpx;
		color: #333333;
		margin-left: 10rpx;
	}

	.integralMoney {
		font-size: 24rpx;
		color: #999;
		margin-top: 10rpx;
	}

	.integralMoney text {
		color: #fc9a00;
	}

	/* 付款方式 */
	.orderPayment_con {
		padding: 20rpx;
		overflow: hidden;
	}

	/* 总价格 */
	.orderPrice_con {
		padding: 50rpx 20rpx;
		font-size: 28rpx;
		text-align: right;
		border-top: 2rpx solid #eee;
		overflow: hidden;
		
	}

	.orderPrice_con text {
		font-size: 36rpx;
		color: #FF3133;
	}

	/* 提交订单 */
	.submitPost_con {
		width: 100%;
		height: 100rpx;
		padding: 20rpx;
		background-color: #fff;
		border-top: 2rpx solid #eee;
		box-sizing: border-box;
		overflow: hidden;
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 100;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.orderPrice {
		flex: 2;
		text-align: left;
		font-size: 28rpx;
		color: #333;
		margin-left: 10rpx;
	}

	.orderPrice text {
		font-size: 24rpx;
		color: #FF4949;
		margin-left: 10rpx;
	}

	.orderBuy {
		width: 190rpx;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		font-size: 28rpx;
		font-weight: bold;
		color: #fff;
		background-color: #327FE8;
		border-radius: 40rpx;
		overflow: hidden;
	}
	
	.formItem{
		background-color: #fff;
		margin-bottom: 0;
	}
</style>
